<template>
	<view class="search">
		<view class="search__head">
			<view class="search__head--item" :class="current == 0 ? 'head--active' : ''" @click="changeList(0)">全部帖子</view>
			<view class="search__head--item" :class="current == 1 ? 'head--active' : ''" @click="changeList(1)">我的发布</view>
			<view class="search__head--item" :class="current == 2 ? 'head--active' : ''" @click="changeList(2)">我的收藏</view>
		</view>
		<view class="search__body">
			<view class="" v-for="item in list" :key="item.Id">
				<u-gap height="8" bgColor="#eee"></u-gap>
				<search-item :data="item" :type="type"/>
			</view>
			<view style="height: 100%;" v-if="noData">
				<no-data text="未搜索到相关内容"></no-data>
			</view>
			<view v-if="noMore">
			  <view class="loading-more" style="height: 80rpx;">
			    <text class="loading-more__text">{{loadingText}}</text>
			  </view>
			</view>
		</view>
	</view>
</template>

<script>
	import _custom from '@/common/_custom.js'
	import _data from '@/common/_data.js'
	import {sendBackFunction} from '@/common/custom_util.js'
	import SearchItem from './components/search-item.vue'
	import NoData from '@/components/custom/no-data/no-data.nvue'
	
	export default {
		components: {
			SearchItem,NoData
		},
		data() {
			return {
				obsusername: _data.localData('name'),
				pxid: _data.localData('userid'),
				keyword: '',//搜索关键字
				currentpage: 1,
				pagesize: 10,
				current: 0,
				list: [],
				noData: false,
				noMore: false,
				loadingText: '没有更多了',
				type: '',//edit: 编辑页选择帖子
			}
		},
		onLoad(options) {
			this.type = options.type;
			if(this.type == 'edit') {
				this.current = 1;
				this.getDataList(1)
			}
			uni.$on('searchScrollToUpper',(v) => {
				uni.navigateTo({
					url: './subject-view?isScroll=1&businessId=' + v.Id
				})
			})
			uni.$on('goHomePage',(v) => {
				if(this.type == 'edit') {
					sendBackFunction('getSubject',v)
					return
				}
				uni.navigateTo({
					url: './homepage?data=' + JSON.stringify(v)
				})
			})
			uni.$on('clickSearchItem',(v) => {
				if(this.type == 'edit') {
					sendBackFunction('getSubject',v)
					return
				}
				uni.navigateTo({
					url: './subject-view?businessId=' + v.Id,
					animationType: 'none'
				})
			})
		},
		onUnload() {
			uni.$off('scrollToUpper');
			uni.$off('goHomePage');
			uni.$off('clickSearchItem');
		},
		//监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。
		onNavigationBarSearchInputConfirmed(e) {
			uni.hideKeyboard();
			this.init();
			this.keyword = e.text;
			this.getDataList();
		},
		onReachBottom() {
			if(this.noData || this.noMore) return
			this.currentpage += 1;
			this.getDataList();
		},
		onNavigationBarButtonTap() {
			uni.navigateBack()
		},
		methods: {
			init() {
				this.noMore = false;
				this.noData = false;
				this.currentpage = 1;
				this.list = [];
			},
			/**
			 * 获取查询中的帖子列表（所有）
			 */
			getSubjectListInSearch() {
				let that = this;
				_custom.getDataJava({
					apiname: 'getSubjectListInSearch',
					currentpage: this.currentpage,
					pagesize: this.pagesize,
					apiparam: {
						obsusername: this.obsusername,
						obspxid: this.pxid,
						keyword: this.keyword,
					},
					success(res) {
						if(res.length < that.pagesize) that.noMore = true;
						if(that.currentpage == 1 && !res.length) {
							that.noMore = false;
							that.noData = true;
						}
						that.list.push(...res);
					}
				})
			},
			/**
			 * 获取自己创建的帖子
			 */
			getSubjectListMyCreated() {
				let that = this;
				_custom.getDataJava({
					apiname: 'getSubjectListMyCreated',
					currentpage: this.currentpage,
					pagesize: this.pagesize,
					apiparam: {
						obsusername: this.obsusername,
						obspxid: this.pxid,
						keyword: this.keyword,
						order: "CreateTime"
					},
					success(res) {
						if(res.length < that.pagesize) that.noMore = true;
						if(that.currentpage == 1 && !res.length) {
							that.noMore = false;
							that.noData = true;
						}
						that.list.push(...res);
					}
				})
			},
			/**
			 * 获取收藏帖子列表
			 */
			getSubjectFavoritesList() {
				let that = this;
				_custom.getDataJava({
					apiname: 'getSubjectFavoritesList',
					currentpage: this.currentpage,
					pagesize: this.pagesize,
					apiparam: {
						obsusername: this.obsusername,
						obspxid: this.pxid,
						sorting: "desc",
						keyword: this.keyword,
					},
					success(res) {
						if(res.length < that.pagesize) that.noMore = true;
						if(that.currentpage == 1 && !res.length) {
							that.noMore = false;
							that.noData = true;
						}
						that.list.push(...res);
					}
				})
			},
			getDataList() {
				switch(this.current) {
					case 0:
						this.getSubjectListInSearch();
						break;
					case 1:
						this.getSubjectListMyCreated();
						break;
					case 2:
						this.getSubjectFavoritesList();
						break;
				}
			},
			changeList(v) {
				this.init();
				this.current = v;
				this.getDataList();
			}
		}
	}
</script>

<style scoped lang="scss">
	.search {
		padding-top: 100rpx;
		min-height: 100vh;
		
		&__head {
			position: fixed;
			left: 0;
			right: 0;
			top: 0;
			/* #ifdef H5 */
			top: 88rpx;
			/* #endif */
			z-index: 9;
			width: 100%;
			display: flex;
			height: 100rpx;
			padding: 0 40rpx;
			box-sizing: border-box;
			background-color: #f5f5f5;
			border-bottom: 3rpx solid #eee;
			
			&--item {
				flex: 1;
				font-size: 35rpx;
				color: #ccc;
				text-align: center;
				line-height: 100rpx; 
			}
		}
		
		&__body {
			min-height: calc(100vh - 100rpx);
			position: relative;
		}
	}
	
	.head--active {
		color: #333;
	}
	
	.loading-more {
		display: flex;
		flex-direction: row; 
		justify-content: center;
		height: 80rpx;
		align-items: center;
		background-color: #F4F5F6;
		
		&__text {
			font-size: 27rpx;
			color: #aaa;
		}
	}
</style>
